<template>
  <div class="company-page overflow-y-auto fill-height">

    <el-row :gutter="16">

      <el-col :span="18">
        <CompanyInfo :api="api"/>
        <CompanyNotice :api="api"/>
      </el-col>

      <el-col :span="6">
        <CompanyQuick/>
      </el-col>

    </el-row>

  </div>
</template>

<script lang="ts" setup>
import { CompanyApi } from "~/api/system/company/company.api";
import { onMounted } from "vue";
import CompanyInfo from "~/views/system/company/CompanyInfo.vue";
import CompanyNotice from "~/views/system/company/CompanyNotice.vue";
import CompanyQuick from "~/views/system/company/CompanyQuick.vue";

const api = new CompanyApi();

onMounted(() => {
  api.getCurrentDetail();
});
</script>

<style lang="scss" scoped>
.company-page {
  padding: 16px;
  background-color: var(--el-bg-color-page);

  .el-card {
    border: none;
  }
}

</style>
